<!doctype html>
<html>
    <head>
        <script type="module" src="/node_modules/@perspective-dev/viewer/dist/cdn/perspective-viewer.js"></script>
        <script type="module" src="/node_modules/@perspective-dev/viewer-d3fc/dist/cdn/perspective-viewer-d3fc.js"></script>
        <script type="module" src="/node_modules/@perspective-dev/viewer-datagrid/dist/cdn/perspective-viewer-datagrid.js"></script>
        <script type="module" src="/node_modules/@perspective-dev/workspace/dist/cdn/perspective-workspace.js"></script>
        <script type="module" src="/node_modules/@perspective-dev/test/load-workspace-arrow.js"></script>

        <link rel="stylesheet" href="/node_modules/@perspective-dev/viewer/dist/css/pro.css" />
        <link rel="stylesheet" href="/node_modules/@perspective-dev/workspace/dist/css/pro.css" />
        <link rel="stylesheet" href="/node_modules/@fontsource/roboto-mono/400.css" />
        <style>
            body {
                display: flex;
                flex-direction: column;
                position: absolute;
                top: 0;
                left: 0;
                right: 0;
                bottom: 0;
                margin: 0;
                padding: 0;
                overflow: hidden;
            }
            #container {
                width: 100%;
                height: 100%;
            }
            perspective-workspace {
                position: absolute;
                top: 0;
                left: 0;
                bottom: 0;
                right: 0;
            }
            perspective-workspace,
            perspective-viewer {
                font-family: "Roboto Mono" !important;
                --preload-fonts: "Roboto Mono:400";
            }
        </style>
    </head>

    <body>
        <perspective-workspace id="workspace"></perspective-workspace>
    </body>
</html>
